﻿@media (max-width:1024px) {
    .head_menu,.head_role,.head_user{
        display: block;
    }
    .f_ewm{display: none}
    .head_reg{
        display: none;
        width: 100%;
        float: none;
        position: absolute;
        top: 71px;
        left: 0;
        background: #fff;
        margin-top: 0;
        padding: 20px 0;
        box-sizing: border-box;
        z-index: 11;
    }
    .w1200{
        width: 100%;
        padding: 0 15px;
        box-sizing: border-box;
    }
    .nav{
        position: fixed;
        right: 0;
        top: 0;
        width: 80%;
        height: 10000px;
        background: #2E2E2E;
        display: none;
        z-index: 11;
    }

    .nav a{color: #fff}
    .nav li{
        text-align: left;
        float: none;
    }
    .nav.active{
        animation: Nav .5s;
        display: block;
    }

    @keyframes Nav {
        0%{
            opacity: 0;
            transform: translateX(100%);
        }
        100%{
            opacity: 1;
            transform: translateX(0%);
        }
    }
    .i_title{
        font-size: 24px;
    }
    #sup ul{
        text-align: center;
    }
    #sup li{
        background: #fff;
        display: inline-block;
        float: none;
        width: 32%;
        margin-left: 2%;
        margin-right: -5px;
        border-radius: 5px;
    }
    #sup li:first-child{
        margin-left: 0;
    }
    #sup li .sup_img{margin-left: 15px;width: 70px;}
    #sup li:hover{background-size: 100% 100%}
    .pt_fun ul {width: 270px;}
    .map{width: 630px;background-size: 100% 100%;}
    .i_news dl{display: inline-block;float: none;margin-left: 20px}

    .join{
        height: 180px;
        box-sizing: border-box;
        padding-top: 40px;
    }
    .join h3{
        text-align: center;
        margin-left: 0;
        float: none;
    }
    .join a{
        float: none;
        display: block;
        margin: 20px  auto 0;
    }


    /*帮助页面*/
    .help_guide a{
        width: 32%;
        margin:0 2% 0 0;
    }
    .help_guide a:last-child{margin-right: 0}
    .help_nav{
        width: 100%;
        float: none;
        height: 120px;
        min-height: 0;
    }
    .help_nav>ul>li,.hc_list li{float: left;width: 32%;margin-left: 2%;box-sizing: border-box}
    .help_nav>ul>li:first-child,.hc_list li:first-child{margin-left: 0}
    .help_nav2{background: #fff}
    .help_nav2 li{float: none;width: 50%}
    .help_list{width: 100%;box-sizing: border-box}
    .help_content{height: auto;padding-bottom: 100px}
}
@media (min-width:481px) and (max-width: 1023px) {
    #sup{
        height: auto;
    }
    #sup li{
        width: 100%;
        height: 150px;
        margin:0 0 20px 0;
    }
    .sup_con{
        width: auto;
        height: auto;
        text-align: left;
    }
    #sup li .sup_img{
        width: 130px;
        height: 100%;
    }
    .pt_center{display: none}
    .pt_fun ul{width: 45%}
    .pt_fun ul:first-child{margin-right: 10%}
    .pt_fun ul li{
        width: 100%;
        margin-top: 30px;
        box-sizing: border-box;
        padding: 10px;
    }
    h2.i_title{padding-bottom: 30px}
    .pt_fun,.i_news{padding-bottom: 50px;height: auto}
    .map{display: none}

    .i_news dl{
        width: 100%;
        margin-left: 0;
        padding-bottom: 30px;
    }
    .i_news dl:first-child{margin-left: 0}
    .footer .f_ewm{display: none}
}
@media (max-width:480px) {
    .pt_center,.map{display: none}
    .logo {
        margin: 14px 80px 0 12px;
    }
    .ib_title{background-size: 100% 100%;width: 100%}
    h2.i_title{font-size: 24px}
    .sup_con{
        margin-left: 130px;
        width: auto;
        float: none;
        margin-top: 0;
        padding: 60px 10px 0 0;
        box-sizing: border-box;
        text-align: left;
    }
    #sup li{display: block;width: 100%;margin-bottom: 30px}
    #sup li .sup_img{
        margin-left: 0;
        float: left;
        width: 130px;
    }
    #sup li:hover{
        border: 1px solid #21d4ff;
        background: none;
        box-shadow: 0  3px 30px #21d4ff;
    }
    #sup,.pt_fun{
        height: auto;
        padding-bottom: 50px;
    }
    .pt_fun ul{text-align: left}
    .pt_fun ul.r{float: none}
    .pt_fun ul li {
        margin-top: 20px;
    }
    h2.i_title{padding-bottom: 30px}
    .i_news dl:first-child{margin:0 0 20px 0;}
    .i_news dl{margin-left: 0}
}


@media (max-width: 375px) {
    .w1200{padding:  0 10px;}
    .logo{margin: 14px 0 0 0}
    .head_menu,.head_user{width: 50px}
}